<template>
  <section class="page-container">
    <section class="content animate__animated  animate__bounceInUp">
      <img
        src="https://oss.qiacaiba.com/screen/screen/detail01_content_001.png"
        alt=""
      >
    </section>
    <section
      class="back"
      @click="goBack"
    >
      <img
        src="https://oss.qiacaiba.com/screen/screen/back.png"
        alt=""
      >
    </section>
    <!-- 技术支持   -->
    <section class="copyRight">
      <img
        src="https://oss.qiacaiba.com/screen/screen/copyright_txt.png"
        alt=""
      >
    </section>
    <!--  logo  -->
    <section class="logo">
      <img
        src="https://oss.qiacaiba.com/screen/screen/logo01.png"
        alt=""
      >
    </section>
  </section>
</template>
<script setup lang="ts">
import { useRouter } from "vue-router";

import { requestStore } from '@/store/request';
const router = useRouter();
const goBack = () => {
  router.go(-1);
};
const request = requestStore();
// request.changeBg("../assets/detail04_bg.png");
</script>

<style scoped lang="scss">
.logo{
  position: fixed;
  top: 80px;
  left: 90px;
  width: 68px;
  height: 88px;

  img {
    display: block;
    width: 100%;
    height: 100%;
  }
}
.copyRight {
  position: fixed;
  bottom: 40px;
  right: 130px;
  width: 255px;
  height: 16px;

  img {
    display: block;
    width: 100%;
    height: 100%;
  }
}
.page-container {
  padding: 0 30px;
  display: flex;
  justify-content: space-between;
  .content{
    width: 100%;
    height: 850px;
    margin-top: 43px;
    img{
      display: block;
      width: 100%;
      height: 100%;
    }
  }
  .back {
    width: 116px;
    height: 54px;
    position: fixed;
    right: 40px;
    top: 80px;
    cursor: pointer;

    img {
      display: block;
      width: 100%;
      height: 100%;
    }
  }

}
</style>
